<template>
  <div class="about-master-container">
    <base-breadcrumb :breadcrumb="!isAudit">
      <a-form-model
        ref="RuleForm"
        :model="formData"
        :rules="rules"
      >
        <a-card
          v-loading="loading || projectLoading"
          :bordered="false"
        >
          <title-name title="满意度调查" />
          <a-row>
            <!-- <a-col span="8">
              <a-form-model-item label="所属分公司">
                <BaseInput
                  v-model="formData.branchComName"
                  disabled
                />
              </a-form-model-item>
            </a-col>
            <a-col :span="8">
              <a-form-model-item label="项目名称">
                <BaseInput
                  v-model="formData.projectName"
                  disabled
                />
              </a-form-model-item>
            </a-col> -->
            <a-col span="16">
              <a-form-model-item
                label="所属单位"
                prop="projectId"
              >
                <OrgTreeSelect
                  v-model="formData.projectId"
                  disabled
                />
              </a-form-model-item>
            </a-col>
            <a-col span="8">
              <a-form-model-item label="项目状态">
                <BaseInput
                  v-model="formData.projectStatusName"
                  disabled
                />
              </a-form-model-item>
            </a-col>
            <a-col :span="8">
              <a-form-model-item label="调查月份">
                <BaseInput
                  v-model="formData.surveyMonth"
                  disabled
                />
              </a-form-model-item>
            </a-col>

            <a-col span="8">
              <a-form-model-item label="业主单位">
                <BaseInput
                  v-model="formData.constructionUnit"
                  disabled
                />
              </a-form-model-item>
            </a-col>
            <a-col span="8">
              <a-form-model-item label="填报人">
                <BaseInput
                  v-model="formData.submitUserName"
                  disabled
                />
              </a-form-model-item>
            </a-col>
            <a-col span="8">
              <a-form-model-item label="填报时间">
                <BaseInput
                  v-model="formData.submitTime"
                  disabled
                />
              </a-form-model-item>
            </a-col>
            <a-col span="8">
              <a-form-model-item label="总分">
                <BaseInput
                  v-model="formData.totalSorce"
                  disabled
                />
              </a-form-model-item>
            </a-col>
            <a-col :span="24">
              <a-form-model-item
                prop="tableData"
                label="调查内容"
              >
                <a-table
                  :pagination="false"
                  :columns="tableColumns"
                  :data-source="formData.tableData"
                  bordered
                >
                  <template
                    slot="pickNumber"
                    slot-scope="text, record, index"
                  >
                    <a-select
                      :default-value="text"
                      placeholder="请选择"
                      :disabled="state == 3"
                      @change="e => handleChange(e, record)"
                    >
                      <a-select-option
                        v-for="item in sgOptions"
                        :key="item.value"
                        :value="item.value"
                      >
                        {{ item.label }}
                      </a-select-option>
                    </a-select>
                  </template>
                </a-table>
              </a-form-model-item>
            </a-col>
            <a-col :span="24">
              <a-form-model-item label="调查意见或建议">
                <BaseTextarea
                  v-model="formData.suggest"
                  :max-length="2000"
                  disabled
                  placeholder="请输入"
                />
              </a-form-model-item>
            </a-col>
          </a-row>
        </a-card>
      </a-form-model>

      <div class="pub-header-btn page-btn-right-top">
        <a-button
          v-if="state == 1"
          :loading="loading"
          type="primary"
          @click="onAdd"
        >
          提交
        </a-button>
        <a-button
          v-if="state == 2"
          :loading="loading"
          type="primary"
          @click="submit"
        >
          提交
        </a-button>
        <a-button
          v-checkVisibleInDetail
          @click="$close"
        >
          关闭
        </a-button>
      </div>
    </base-breadcrumb>
  </div>
</template>

<script>
import { planAddFile, planFileList, planFileListDel, planListDetail, print } from '@/api/material/procurement/plan'
import { getCustomerSatisfactionSurveyById, queryProportionList, getTotalScore, updateByPrimaryKeySelective } from '@/api/complaint/satisfactionsurvey.js'

export default {
  name: 'a' + Date.now(),
  props: {
    isAudit: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      handData: {},
      levelData: [
        {
          name: '一般投诉',
          id: '1'
        },
        {
          name: '严重投诉',
          id: '2'
        },
        {
          name: '紧急投诉',
          id: '3'
        }
      ],
      key: '1',
      loading: false,
      state: Number(this.$route.query.state),
      isSubmit: false,
      statuCode: '3',
      row: this.$route.query.row,
      form: { editorName: '', subContractUnitId: '' },
      tableColumns: [
        {
          title: '调查内容',
          dataIndex: 'name',
          width: '25%'
        },
        {
          title: '分值占比',
          dataIndex: 'numberzb',
          width: '25%'
        },
        {
          title: '评价分数',
          dataIndex: 'pickNumber',
          width: '25%',
          scopedSlots: { customRender: 'pickNumber' }
        }
      ],
      formData: {
        tableData: [],
        branchComId: '',
        projectId: '',
        projectName: ''
      },
      rules: {
        constructionStage: { required: true, message: '请选择施工阶段', trigger: 'change' },
        projectId: { required: true, message: '请选择项目名称', trigger: 'change' },
        branchComId: { required: true, message: '请选择所属分公司', trigger: 'change' },
        subcontractorId: { required: true, message: '请选择责任分包', trigger: 'change' },
        responsible: { required: true, message: '请选择投诉责任方', trigger: 'change' },
        treeId: { required: true, message: '请选择投诉类型', trigger: 'change' },
        infoId: { required: true, message: '请选择投诉事项', trigger: 'change' },
        complainant: { required: true, message: '请选择投诉人', trigger: 'change' },
        tableData: { required: true, message: '请完成调查内容', trigger: 'change' },
        handleResult: { required: true, message: '请输入总人数', trigger: 'blur' }
      },
      mode: this.$route.query.pageTyp === 'add' ? 'add' : 'edit',
      file: {
        mode: this.$route.query.pageTyp === 'add' ? 'add' : 'edit',
        businessCode: 'CUSTOMER01',
        needPage: false,
        fileList: [],
        useMultiDelete: true,
        useMultiExport: true
      },
      projectLoading: false,
      tsUserOptions: [],
      sgOptions: [],
      planAddFile: planAddFile(),
      planFileList: planFileList(),
      planFileListDel: planFileListDel(),
      getProgrammeArr: [],
      bimData: [],
      proData: [],
      subcontractingData: [],
      treeLoading: false,
      yhData: [],
      typeData: [],
      projectData: [],
      ownerData: [],
      treeData: []
    }
  },

  watch: {
    formData: {
      deep: true,
      handler() {
        this.$checkRequireItem()
      }
    },
    isAudit: {
      // 是否作为审批详情
      immediate: true,
      handler(val) {
        if (val) {
          this.state = 3
        }
      }
    }
  },
  created() {
    this.initCode()
  },
  mounted: function () {
    for (let i = 0; i < 101; i++) {
      this.sgOptions.push({
        label: i,
        value: i
      })
    }
    console.log(this.sgOptions)
    if (this.state != 1) {
      this.getDetail()
      this.isSubmit = true
    }
  },
  methods: {
    handleChange(e, v) {
      this.formData[v.code] = e
      v.pickNumber = e
      getTotalScore({ ...this.formData, tableData: null }).then((res) => {
        this.formData.totalSorce = res.data
      })
    },
    getTabChange(e) {
      this.$checkRequireItem()
    },
    getDetail() {
      this.loading = true
      getCustomerSatisfactionSurveyById({ id: this.$route.query.id }).then((res) => {
        queryProportionList().then((resp) => {
          const newTable = []
          resp.data.map((item) => {
            newTable.push({
              name: item.name,
              numberzb: item.proportion + '%',
              code: item.code,
              pickNumber: res.data[item.code] ? res.data[item.code] : 0
            })
          })
          res.data.tableData = newTable
          this.formData = res.data
          this.loading = false
        })
      })
    },
    initCode() {
      // this.loading = true
      // getPCProjectList({ owner: false }).then(res => {
      //   this.projectData = res.data
      // })
      // queryComplaintTree().then(res => {
      //   res.data[0].children.forEach(item => {
      //     item.disabled = true
      //   })
      //   this.typeData = res.data[0].children
      //   this.loading = false
      // })
    },
    // 编辑新增时候的保存
    submit() {
      this.$refs.RuleForm.validate((valid) => {
        if (valid) {
          this.$submitConfirm(async () => {
            this.loading = true
            updateByPrimaryKeySelective({ ...this.formData, tableData: null }).then((res) => {
              if (res.code == 200) {
                this.loading = false
                this.$message.success('提交成功')
                this.$multiTab.close(this.$route.fullpath)
              } else {
                this.loading = false
              }
            })
          })
        } else {
          this.$message.warning("请填写完所有必填项信息")
        }
      })
    }
  }
}
</script>
